import React from 'react';
import { observer } from "mobx-react";
import { toJS } from 'mobx';
import D3Tree from '../tree/RectTree';
import { Tools, Toast as message } from 'weaver-mobile';
const { getLabel } = Tools;

//@withRouter
@observer
export default class TaskViewPath extends React.Component {
    constructor(props) {
        super(props);
      }
    render() {
        const { store } = this.props;
        return (
            <div className="govern-task-view-path" >
                <D3Tree
                    data={toJS(store.node)}
                    onClickTitle={this.openNode}
                    layout={store.layout}
                    showRight={false}
                    desc="submitDate"
                    scale ={8}
                    zoom={this.zoom}
                    showMenu={true}
                    onReject={store.task.hasRejectBtn && store.reject}
                    onBatchReject={store.task.hasBatchRejectBtn && store.batchReject}
                    nameTitle={getLabel('506148', '点击查看数据')}
                    showname={this.getShowname}
                    showstatus={this.showstatus}
                    remark = {this.remark}
                    showStatus={true}
                    showTaskName={true}
                />
            </div>
        )
    }
    getShowname = (d) => {
        return `${d.name}`;
    }

    showstatus = (d) => {
        return `${d.statusSpan}`;
    }

    remark = (d) => {
        return `${d.remark}`;
    }

    changeLayout = (e) => {
        const { store } = this.props;
        store.changeLayout(e.target.value);
    }

    openNode = (d) => {
        // console.log("跳转任务详情页", this)
        const {  match:{url},history:{push}} = this.props;
        const newPath = url.substr(0,url.lastIndexOf('/'));
        push(`${newPath}/content?id=${d.id}`);
        // message.info(getLabel('1', '跳转任务详情页！'));
        return;
    }

    zoom = (scale) => {
       return 80;
    }
}